<!doctype html>
<html>
<head>
    <meta charset="utf-8">
    <title>非破坏性操作-之前</title>
    <link rel="stylesheet" href="../../css/common.css">
    <script type="text/javascript" src="../../js/jquery.js"></script>
    <!--    <script type="text/javascript" src="color_jquery.js"></script>-->
    <script>
        (function ($) {
            $.extend($.fn, {
                parent: function () { // 扩展 jQuery 对象方法，获取所有匹配元素的父元素
                    var arr = [];
                    $.each(this, function (index, value) { // 遍历匹配的 DOM 元素
                        arr.push(value.parentNode); // 把匹配元素的父元素推入临时数组
                    });
                    arr = $.unique(arr);    // 在临时数组中过滤重复的元素
                    // console.log(arr instanceof Array);
                    /* 把变量 arr 打包为伪数组类型返回*/
                    /**************这个方法会破坏dom对象******************/
                    this.length = 0;//把this数组里清空了
                    Array.prototype.push.apply(this, arr);//数组合并相当于concat
                    /**************参考103demo******************/
                    // console.log(this instanceof Array);
                    return this;
                }
            });
        })(jQuery); // 封装插件

        $(function () {
            var $p = $("p"); // 获取所有p元素，并存储到变量 $p 中
            // console.log($p.parent());
            $p.parent().css("border", "2px solid blue");  // 调用 parent() 方法获取 p 元素的父元素，并设置它们的边框样式
           $p.hide();
        })

        /*
        * $.each(target, function (index, value) {
        *   target 可以是数组、DOM、json等，取决于直接给定或者ajax返回的类型
        *     // each处理一维数组
              var arr1 = [ "aaa", "bbb", "ccc" ];
              $.each(arr1, function(i,val){
                  alert(i);
                  alert(val);
              });
              // 处理json数据，例如ajax的返回值
              var obj = { one:1, two:2, three:3};
            　$.each(obj, function(key, val) {
                  alert(key);
                  alert(val);
              });
        * }
        *
        * */
    </script>
</head>
<body>
<div style="width: 400px; height: 200px;">大盒子
    <p>段落文本1</p>
    <div style="width: 200px; height: 100px;">小盒子
        <p>段落文本2</p>
    </div>
</div>
<script>
   /* var obj = {one: 1, two: 2, three: 3};
    $.each(obj, function (key, val) {
        alert(key);
        alert(val);
    });*/
   var a = [1,2,3], b = [4,5,6];
   // a = a.concat(b);
   a.length = 0;
   Array.prototype.push.apply(a,b);
   console.log(a);
</script>
</body>
</html>
